<template>
    <div class="als">
        <!--商品栏-->
        <van-list
                v-model="loading"
                :finished="finished"
                finished-text="没有更多了"
                @load="onLoad"
                style="margin-bottom: 60px;margin-top:5px;padding: 0 15px">
            <!--综合搜索-->
            <van-cell v-for="(v,i) in all" :key="i" style="">
                <div>
                    <!--图片-->
                    <div>
                        <img :src="v.small" alt="" style="width: 100%;">
                    </div>
                    <!--信息-->
                    <div>
                        <!--是否自营与信息-->
                        <p style="font-weight: 500;
    vertical-align: middle;
    font-size: 15px;overflow: hidden;
    word-break: break-all;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;-webkit-line-clamp: 2"><span v-if="v.self_operated == 1" style="border-radius: 4px;
    color: #fff;
    font-size: 10px;
    width: 30px;
    text-align: center;
    padding: 2px 4px;background: linear-gradient(90deg,#fd5632 0,#ef0d25);margin-right: 5px;">自营</span><span style="font-size: 15px;">{{v.name}}</span>
                        </p>
                        <!--价格-->
                        <p style="margin: 27px 0 5px 0;"><span style="color: rgb(250, 53, 52);
    font-size: 10px;
    font-weight: 600;">￥</span><span style="color: rgb(250, 53, 52);
    font-size: 16px;
    font-weight: 600;">{{v.price}}</span></p>
                        <!--购买记录与评价-->
                        <p style="font-size: 12px;
    color: #82848a;"><span>{{v.buy_count}}人已购买</span><span>{{v.comment_num}}条评论</span></p>
                    </div>
                </div>
            </van-cell>
        </van-list>
    </div>
</template>

<script>
    import jsp from '../../../Api/Api'

    export default {
        name: "Allgoods",
        data() {
            return {
                all: [],
                numm: 1,
                loading: false,
                finished: false,
            }
        },
        methods: {
            onLoad() {
                let a = this.$route.query.shop_id
                // console.log(this.numm)
                jsp.shopAlls(this.numm, a).then(data => {
                    // console.log(data.data)
                    this.all.push(...data.data.data)
                    // console.log(this.numm)
                    this.numm++
                    this.loading = false;
                    if (this.all.length >= data.data.data_total) {
                        this.finished = true;
                    }
                }).catch(error => console.log(error))
            },
        },
    }
</script>

<style scoped>
    >>>.van-list{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    >>>.van-cell{
        width: 48%;
        background: #fff;
        overflow: hidden;
        margin: 5px 0;
        border-radius: 10px;
    }
</style>